13-2 ぅwq阞洏

若要一再重複使用多個函數,可以先將這些函數的定義寫在函數定義檔,然後再將此檔案導入 asp 網頁。

第一種方式,是使用 Server-side include (SSI) 的方式將函數的定義加入網頁,其格式如下:

<!--#include file="filename"-->
其中 filename 代表檔案的實體位置,可加上相對或絕對路徑。另一種方式是:
<!--#include virtual="URLpath"-->
其中 URLpath 代表檔案的網址,可以是相對或絕對的網址。 換句話說,我們可將函數的定義寫在一個檔案中,若某一個網頁要用到這個函數,只要將相對應的檔案利用 SSI 的方式來加入網頁即可。

在下列範例中,我們分別使用 client-side include 和 server-side include 來加入一些與時間相關的函數:

Example(timeDisplay02.asp):

上述範例的原始檔如下:

原始檔(timeDisplay02.asp):(灰色區域按兩下即可拷貝)
<%@language=jscript%>
<%title="使用函數定義檔案來顯示現在時間"%>
<!--#include file="head.inc"-->
<hr>

<p>timeFunctionRunAtClient.js:<br>
<script src="timeFunctionRunAtClient.js"></script>
<script>
document.write('現在是「' + currentTime()+ '」!<br>');
document.write('今天是「' + currentDay() + '」!<br>');
</script>

<p>timeFunctionRunAtServer.inc:<br>
<!--#include file="timeFunctionFunAtServer.inc"-->
<%
Response.write('現在是「' + currentTime()+ '」!<br>');
Response.write('今天是「' + currentDay() + '」!<br>');
%>

<hr>
<!--#include file="foot.inc"-->

其中,使用 client-side include 所加入的檔案是 timeFunctionRunAtClient.js:

原始檔(timeFunctionRunAtClient.js):(灰色區域按兩下即可拷貝)
function currentTime(){		// 回傳現在的時間
	var today = new Date();
	return(today.toLocaleString());
}

function currentDay(){		// 回傳今天星期幾
	var today = new Date();
	var day = today.getDay();	// 取得今天是星期幾
	var conversion=["天", "一", "二", "三", "四", "五", "六"];
	return("星期"+conversion[day]);
}

而使用 server-side include 所加入的檔案是 timeFunctionRunAtServer.inc:

原始檔(timeFunctionFunAtServer.inc):(灰色區域按兩下即可拷貝)
<%
function currentTime(){		// 回傳現在的時間
	var today = new Date();
	return(today.toLocaleString());
}

function currentDay(){		// 回傳今天星期幾
	var today = new Date();
	var day = today.getDay();	// 取得今天是星期幾
	var conversion=["天", "一", "二", "三", "四", "五", "六"];
	return("星期"+conversion[day]);
}
%>

這兩個檔案的內容幾乎一樣,唯一不同的是,timeFunctionRunAtServer.inc 在函數前後各加上了 <% 和 %>。

Hint
SSI 檔案的內容,也可以包含 HTML 或用戶端的 JavaScript、VBScript 等。

在使用 SSI 時,有幾點要特別注意:

如果希望將某些常用的函數放在一個檔案,並讓客戶端及伺服器端都能執行這些函數,此時我們就可以使用第二種方式來讀入此函數定義檔,此方法很像 JavaScript 在用戶端所使用的 client-side include,其命令格式如下:
<script language=jscript runat=server src=timeFunction.js></script>
請見下列範例:

Example(timeDisplay03.asp):

上述範例的原始檔如下:

原始檔(timeDisplay03.asp):(灰色區域按兩下即可拷貝)
<%@language=jscript%>
<%title="使用函數定義檔案來顯示現在時間"%>
<!--#include file="head.inc"-->
<hr>

<p>timeFunction.js run at client:<br>
<script src="timeFunction.js"></script>
<script>
document.write('現在是「' + currentTime()+ '」!<br>');
document.write('今天是「' + currentDay() + '」!<br>');
</script>

<p>timeFunction.js run at server:<br>
<script language=jscript runat=server src="timeFunction.js"></script>
<%
Response.write('現在是「' + currentTime()+ '」!<br>');
Response.write('今天是「' + currentDay() + '」!<br>');
%>

<hr>
<!--#include file="foot.inc"-->

在上述範例中,無論是 client-side include 或是 server-side include,所加入的函數定義檔案都是 timeFunction.js,其內容如下:

原始檔(timeFunction.js):(灰色區域按兩下即可拷貝)
function currentTime(){		// 回傳現在的時間
	var today = new Date();
	return(today.toLocaleString());
}

function currentDay(){		// 回傳今天星期幾
	var today = new Date();
	var day = today.getDay();	// 取得今天是星期幾
	var conversion=["天", "一", "二", "三", "四", "五", "六"];
	return("星期"+conversion[day]);
}

因此我們可以寫一個函數定義檔,同時在伺服器和用戶端都使用此檔案,如此就可以達到「一箭雙鵰」(寫一份函數在伺服器和用戶端共用)的最高境界!

Hint
請注意:
  • 適用此方法的函數定義檔,不可以包含 HTML 原始碼。
  • 函數定義檔的副檔名,最好是 js,以避免因為瀏覽器改版而導致前後行為不一的情況。


JScript 程式設計與應用:用於伺服器端的 ASP 環境